import { useEffect, useState } from 'react'
import { Contest } from './styles/style'
import ContestTab from './components/ContestTab'
import ContestList from './components/ContestList'
import 'antd/dist/antd.css' //引入UI框架的样式
import {Spin} from 'antd'
function App() {

  const [activekey,setActivekey]=useState('all')
  const [loading,setLoading]=useState(true)
  // const [show,setShow]=useState(true)
  useEffect(()=>{
    setTimeout(()=>{
      setLoading(false)
    },2000)
  },[])
  return (
    <div className="App">
      <Contest>
        <h1>热门赛事</h1>
        <ContestTab  
          setActivekey={setActivekey} 
          activekey={activekey}
          setLoading={setLoading}
        />
        <Spin spinning={loading} tip="加载中~">
          <ContestList activekey={activekey}/>
        </Spin>
        
      </Contest>
    </div>
  )
}

export default App
